<template>
<view>
	<u-navbar :is-back="false" title="添加交单信息"
	  title-size="30"
	  :background="{background:'#2B88FE' }"
	  title-color="#fff">
	  <div class="head_icon">
	    <u-icon @click="$api.handleBackTo"
	      name="arrow-left" color="#fff"
	      size="36">
	    </u-icon>
	    <u-icon @click="$api.handleHomeTo"
	      name="home" color="#fff" size="36">
	    </u-icon>
	  </div>
	</u-navbar>
	
  <div class="app-draw-add">
    <div>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
	   送货订单数（个）： {{detail.OrderCount}}</view>
	 
	</view>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
	   订单总金额（元）： {{detail.Money}}</view>
	
	</view>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
	   已收金额（元）</view>
	 <input placeholder="请输入" v-model="detail.PayMoney" type="digit"
	    class="x-col x-col-center"></input>
	</view>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
		其中：现金（元）</view>
	 <input placeholder="请输入" v-model="detail.PayCash" type="digit"
	    class="x-col x-col-center"></input>
	</view>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
	   微信（元）</view>
	 <input placeholder="请输入" v-model="detail.PayWeiXin" type="digit"
	    class="x-col x-col-center"></input>
	</view>
	<view class="topheader x-row " style="border: 0;">
	  <view class="titel x-col">
	   银行转账（元）</view>
	 <input placeholder="请输入" v-model="detail.PayBank" type="digit"
	    class="x-col x-col-center"></input>
	</view>
	
      <div class="draw-mark">
        <span>备注（非必填）</span>
        <u-input
          type="textarea"
          v-model="detail.Info"
          border></u-input>
      </div>
	  
	  <view class="slot-content">
	    <u-table>
	      <u-tr class="u-tr">
	        <u-th class="u-th" width="35%">商户名称</u-th>
	        <u-th class="u-th" width="20%">订单金额</u-th>
	        <u-th class="u-th" width="20%">已收金额</u-th>
	        <u-th class="u-th">送达时间</u-th>
	   
	      </u-tr>
	      <u-tr class="u-tr" v-for="(item,i) in detail.orderlist" :key="i">
	        <u-td class="u-td" width="35%">{{item.MrkName}}</u-td>
	        <u-td class="u-td" width="20%">{{item.Money}}</u-td>
	        <u-td class="u-td"  width="20%">{{item.PayMoney}}</u-td>
	        <u-td class="u-td">{{item.DefTime}}</u-td>
	   
	      </u-tr>
	    </u-table>
	  </view>
	  
      <div class="footer">
        <u-button>取消
        </u-button>
        <u-button
          type="primary"
          @click="handleSave">
          提交
        </u-button>
      </div>
    </div>
  </div>
   </view>	
</template>

<script>
import appProduct from '@/components/app-product'
export default {
  components: {
    appProduct
  },
  data() {
    return {
      isAllList: true,
      form: {
        UserId: 0,
        Key: '',
        ProClassId: 0
      },
      info: {
        InOut: 1,
        iType: 2,
        CarId: 0,
        CarNo: '',
        Info: ''
      },
	  detail:[],
      page: 1,
      formdata: [],
      list: []
    }
  },
  onReachBottom() {
    if (!this.isAllList) return
    this.page += 1
    this.getList()
  },
  methods: {
    defaultData(cb) {
      this.page = 1
      this.list = []
      this.isAllList = true
      cb && cb()
    },
    changeSearch() {
      this.defaultData(() => {
        this.getList()
      })
    },
    handleSave() {
		
		if (this.detail.OrderCount==0) {
		  uni.showToast({
		    title: '没有需要回交的任务，不用提交：',
		    icon: 'none',
		    duration: 2000
		  })
		  return false
		}
		
      this.$axios('api/CarReport/AddDetail', 'post', { value: this.detail }).then(res => {
      if (!res.Success) {
        uni.showToast({
          title: '提交失败：'+res.Message,
          icon: 'none',
          duration: 2000
        })
        return false
      }
	    this.$api.handleToUrl('提交成功', '/pages/driver/carreport')
      })
    },
    getList() {
      this.$axios('api/CarReport/GetUserSumReportInfo', 'post', { value: 0}).then(res => {
		  
		  this.detail=res.Value
         
      })
	}
  },
  onShow() {
    this.getList()
  }
}
</script>

<style lang="scss" scoped>
.app-draw-add {
  padding-bottom: 70rpx;
  .draw-item {
    .title {
      font-size: 30rpx;
      color: #7f7f7f;
      margin-top: 30rpx;
      margin-left: 30rpx;
    }
  }
  .draw-add {
    color: #007aff;
    font-size: 30rpx;
    padding: 32rpx;
    text-align: center;
  }
  .draw-mark {
    display: flex;
    padding: 0 32rpx;
    u-input {
      flex: 1;
    }
  }
  .footer {
    margin-top: 32rpx;
    display: flex;
    justify-content: center;
    position: sticky;
    bottom: 2%;
    u-button,
    .u-btn {
      width: 40%;
    }
    u-button + u-button {
      margin-left: 30rpx;
    }
  }
}


.topheader {
  padding: 0 32upx;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.titel {
  color: #34404a;
  font-size: 32upx;
  padding: 32upx 0;
}

.img60 {
  width: 60upx;
  height: 60upx;
  border-radius: 30upx;
}

.img60:nth-child(1) {
  transform: translateX(60upx);
}

.img60:nth-child(2) {
  transform: translateX(30upx);
}

.imgadd {
  width: 26upx;
  height: 26upx;
  display: block;
}

.bu_text {
  color: #2b88fe;
  font-size: 28upx;
  padding-left: 10upx;
}

.addBtn {
  color: #999;
}
.u-form-item{line-height: 10upx;}
.price {
  color: #eb3e00;
  font-size: 32upx;
}

.label {
  color: #2b88fe;
  border: 1px solid #2b88fe;
  padding: 3upx 10upx;
  border-radius: 30upx;
  font-size: 24upx;
  margin-left: 10upx;
}

.interval {
  color: #333;
  font-size: 32upx;
  line-height: 110upx;
  padding: 0 32upx;
}

.listgoods {
  padding: 32upx;
  border-bottom: 1px solid #f8f8f8;
}

.goodsimg {
  width: 144upx;
  height: 144upx;
  display: block;
  margin-right: 24upx;
}

.goodstitel {
  color: #000;
  font-size: 32upx;
}

.rights {
  color: #000;
  font-size: 333;
  font-size: 32upx;
}

.nuber {
  color: #666;
  font-size: 28upx;
  padding-top: 10upx;
}

.time {
  color: #666;
}

.prme {
  color: #000;
  font-size: 32upx;
  font-weight: bold;
}

.viewbbutton {
  position: fixed;
  bottom: 0;
  background: #fff;
  width: 100%;
  .x-row {
    display: flex;
    justify-content: center;
    ::v-deep button {
      margin: 0 20rpx;
    }
  }
}

.buttom {
  width: 95%;
  background: #007aff;
  border-radius: 16upx;
  text-align: center;
  line-height: 80upx;
  margin: auto;
  margin-top: 10upx;
  color: #fff;
  font-size: 32upx;
}
.leftbut {
  border: 1px solid #999;
  text-align: center;
  font-size: 32upx;
  color: #333;
  line-height: 80upx;
  border-radius: 16upx;
}
.right {
  border-color: #007aff;
  color: #fff;
  background: #007aff;
}
u-button + u-button {
  margin-left: 10rpx;
}
.u-input {
  border: 1px solid #dddd;
  padding: 10rpx;
}
</style>